﻿<!DOCTYPE html>
<html lang="en">
<head>
    <title id="description">Display jqxEditor in window.</title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="../../scripts/demos.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxwindow.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxeditor.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdropdownbutton.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            // create button.
            $("#openButton").jqxButton();
            // create window.
            $('#window').jqxWindow({
                autoOpen: false, width: 600, position: 'top, left', height: 400, maxWidth: 800, resizable: false,
                initContent: function () {
                    // create editor.
                    $("#editor").jqxEditor({ tools: 'bold italic underline font size', width: '100%', height: '100%' });
                }
            });

            $("#openButton").click(function () {
                $('#window').jqxWindow('open');
            });
        });
    </script>
</head>
<body class='default'>
    <button id="openButton">Open Editor</button>
    <div id="window">
        <div>
            jqxEditor
        </div>
        <div>
            <div id="editor"></div>
        </div>
    </div>
</body>
</html>
